<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>登录</title>
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/renting/css/public.css"/>
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/renting/css/header.css"/>
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/renting/css/login.css"/>

    <script src="${pageContext.request.contextPath}/renting/js/jQuery-3.4.1.js"></script>
    <script src="${pageContext.request.contextPath}/renting/js/login.js"></script>
</head>
<body>
<div class="header">
    <div class="nav">
        <a href="${pageContext.request.contextPath}/renting/index.jsp" class="nav_title">好客租房</a>
        <ul class="nav_ul">
            <li><a href="${pageContext.request.contextPath}/renting/index.jsp">首页</a></li>
            <li><a href="${pageContext.request.contextPath}/renting/pages/onther/Findroom.jsp">轻松找房</a></li>
            <li><a href="${pageContext.request.contextPath}/renting/pages/onther/entry.jsp">房东入驻</a></li>
            <li><a href="${pageContext.request.contextPath}/renting/pages/onther/chat_news.jsp">消息</a></li>
            <li><a href="${pageContext.request.contextPath}/renting/pages/onther/login.jsp" style="color: #2981c8;">登录</a></li>
        </ul>
        <img src="${pageContext.request.contextPath}/renting/img/icon/lianxi-1.png" class="nav_img">
        <p class="nav_phone">
            <span>13301131116</span>
            <span>13301131116</span>
        </p>
    </div>
</div>
<div class="banner">
    <div class="login">
        <p class="login_title">好客租房</p>
        <div class="login_tab">
            <p></p>
            <span class="login_on" onclick="spannoe()">我是租客</span>
            <span onclick="spanton()">我是房东</span>
            <input type="hidden" id="spa" value="0">
            <script>
                function spannoe(){
                    $("#spa").val("0");
                }
                function spanton(){
                    $("#spa").val("1");
                }
            </script>
            <p></p>
        </div>
        <form action="${pageContext.request.contextPath}/renting/UserInfoLoging" class="login_form">
            <label class="login_label">
                <span class="login_font">账户:</span>
                <input type="text" id="UserInfoName" placeholder="请输入手机号" class="login_user" maxlength="11">
                <p class="user_p"></p>
        </label>
            <label class="login_label">
                <span class="login_font">密码:</span>
                <input type="password" placeholder="请输入密码" id="UserInfoPwd" class="login_pswd" maxlength="20">
                <p class="pswd_p"></p>
        </label>
         <label class="login_label">
                <span class="login_font">验证码:</span>
                <input type="text" id="verify" class="vcode_input">
                <img id="refreshCaptcha" class="validateImg" style="width: 80px;height: 30px;margin-top: 4px"  src="${pageContext.request.contextPath}/user/getCode" onclick="changeCode(this)" >
            </label>
            <label class="login_checkbox">
                <img src="${pageContext.request.contextPath}/renting/img/icon/radio-default.png" class="login_radio">
                <input type="checkbox">
                <span>我已阅读并同意<a href="">[好客租房用户服务协议]</a></span>
            </label>

            <label class="login_submit">
                <input id="login1" type="submit" value="登录" onclick="buttonClick()" class="submit">
            </label>
        </form>
        <form action="" class="register_form">
            <label class="register_label">
                <span class="register_font">账户:</span>
                <input id="register_user" in type="text"  placeholder="请输入手机号" class="register_user" maxlength="11">
                <a id="rv" class="register_vcode" onclick="rvclock()">获取验证码</a>
                <script>
                    var time=60;
                    var rv=null;
                    //手机号验证码
                    function rvclock(){
                        if(time!=60|| $("#register_user").val()==""){
                            return;
                        }
                        if($("#spa").val()==0){
                            $("#register_user").attr('placeholder','暂时不能注册房东');
                            return;
                        }
                        $.ajax({
                            url:"${pageContext.request.contextPath}/userInfo/RegistrationVerification",// 请求路劲
                            type:"post",//提交方式
                            data:{"phoneNumber":$("#register_user").val()},//请求参数
                            success:function (data){
                                if (data==1){
                                    $("#register_user").val('');
                                    $("#register_user").attr('placeholder','号码错误');
                                }else {
                                    vr=data;
                                    if(time==60){
                                        var time1=setInterval(function(){
                                            if(time==0){
                                                $("#sendsms").html("已过期");
                                                $("#sendsms").removeAttr("disabled")
                                                time=60;
                                                clearInterval(time1);
                                            }else{
                                                $("#sendsms").attr("disabled","true")
                                                $("#sendsms").html(time+"后秒过期");
                                                time--;
                                            }

                                        },1000)
                                    }
                                }
                            }
                        })

                    }
                </script>
                <p class="register_user_p">请输入正确的手机号</p>
            </label>
            <label class="register_label">
                <span class="register_font">密码:</span>
                <input id="registerPwd" type="password"  placeholder="请输入密码" class="register_pswd">
                <p class="register_pswd_p">密码不能小于6位且不能大于20位</p>
            </label>
            <label class="register_label">
                <span class="register_font">确认密码:</span>
                <input id="registerPwdNoe" type="password"  placeholder="请输入密码" class="register_conf">
                <p class="register_conf_p">密码不一致</p>
            </label>
            <label class="register_label">
                <span class="register_font">验证码:</span>
                <input id="registerSendsms" type="text"  class="register_code"><font color="#a9a9a9" id="sendsms" style="margin-left: 10px;size: 10pt"></font>
            </label>
            <button type="button" class="register_btn" onclick="registerClick()">立即注册</button>
            <script>
                //注册
                function registerClick(){
                    alert(vr);
                    if(time==60){
                        $("#registerSendsms").val('');
                        $("#registerSendsms").attr('placeholder','验证码已过期！');
                        return;
                    }
                    if($("#registerPwd").val()!=$("#registerPwdNoe").val()){
                        $("#registerPwdNoe").val('');
                        $("#registerPwdNoe").attr('placeholder','与密码不一致！！');
                        return;
                    }
                    if($("#registerSendsms").val()!=vr){
                        $("#registerSendsms").val('');
                        $("#registerSendsms").attr('placeholder','验证码错误！');
                        return;
                    }
                    //编写一个js的对象
                    var user = {
                        phone:$("#register_user").val(),
                        isHouse:1,
                        password:$("#registerPwd").val()
                    };
                    //将js对象转换成json字符串
                    var str = JSON.stringify(user);
                    $.ajax({
                        url:"${pageContext.request.contextPath}/userInfo/register",// 请求路劲
                        type:"post",//提交方式
                        data:{"json":str},//请求参数
                        success:function (data1){
                            if(data1==1){
                                $("#register_user").val('');
                                $("#register_user").attr('placeholder','号码以此在');
                            }else {
                                alert("注册成功！！");
                                window.location.reload();
                            }
                        }
                    })
                }
            </script>
        </form>
        <p class="register_p">
            <span>已有账号？<a id="login_href">马上登陆</a></span>
        </p>
        <p class="login_p">
            <span><a id="register_href">立即注册</a></span>
            <span><a id="forget_href">忘记密码?</a></span>
        </p>
    </div>
</div>
<div class="bottom">
    <div class="item">
        <img src="${pageContext.request.contextPath}/renting/img/icon/anquan-blue.png" >
        <p>安全</p>
        <p>真实安全防盗天下无贼</p>
    </div>
    <div class="item">
        <img src="${pageContext.request.contextPath}/renting/img/icon/chengnuo-blue.png" >
        <p>承诺</p>
        <p>我们只用实力说话</p>
    </div>
    <div class="item">
        <img src="${pageContext.request.contextPath}/renting/img/icon/pinzhi-blue.png" >
        <p>品质</p>
        <p>简约时尚宜家风格</p>
    </div>
    <div class="item">
        <img src="${pageContext.request.contextPath}/renting/img/icon/fuwu-blue.png" >
        <p>服务</p>
        <p>真心诚意对待每一个客户</p>
    </div>
</div>
<script>
    changeCode=code=>code.src=code.src+"?"+new Date().getTime();
    //登录
    function buttonClick(){
            $.ajax({
                url:"${pageContext.request.contextPath}/userInfo/UserInfoLoging",// 请求路劲
                type:"post",//提交方式
                data:{"UserInfoName":$("#UserInfoName").val(),"UserInfoPwd":$("#UserInfoPwd").val(),"verify":$("#verify").val(),"spa":$("#spa").val()},//请求参数
                success:function (data){
                    if(data==2){
                        alert("验证错误");
                        code=>code.src=code.src+"?"+new Date().getTime();
                        $("#verify").val('');
                        $("#verify").attr('placeholder','验证码错误！！')
                    }else if(data==1){
                        $("#UserInfoPwd").val('');
                        $("#UserInfoPwd").attr('placeholder','用户名或密码错误！！')
                    }else if(data==3){
                        alert("您还不是房东！！");
                    }
                    else {
                        var obj=JSON.parse(data);
                        sessionStorage.setItem("login",obj.loginMethod==1?2:obj.loginMethod==0?1:"");
                        sessionStorage.setItem("username",obj.name);
                        window.location.href="${pageContext.request.contextPath}/renting/index.jsp"
                    }
                },
                error:function (){
                    alert("失败")
                }
            })
    }
</script>
</body>
</html>